import { router, addRoutes } from '~/router'
import store from './store'
import { getCache } from '~/composables/localStorage'
import { showGlobalProgress, doneGlobalProgress } from '~/composables/utils'
import { constant, parseMenus } from '~/utils/globalv'
import { getUserMenus } from '~/api/manager'

let isMenusExists = false;
router.beforeEach((to,from,next) => {
  showGlobalProgress()
  const token = getCache('token')
  // 没有登录的话要先登录
  if(!token && to.path !== '/login') {
    return next({path: '/login'})
  }

  // 防止重复登录
  if(token && to.path === '/login'){
    return next({path: from.path ? from.path : '/'})
  }

  // F5刷新会导致 vuex 中保存的 userInfo 被清除，此处使用 localStorage 填充
  const cacheUserInfo = getCache('userInfo');
  if(token && cacheUserInfo)
    store.commit('setUserInfo',cacheUserInfo)

  // F5刷新左侧菜单
  const menus = getCache(constant.menus)
  if(menus)
    store.commit('setMenus',menus)

  // 每次切换页面都使用新页面的 title 填充 title
  const title = to.meta.title;
  if(title)
    document.title = title + ' - ' + constant.appTitle


  // 左侧导航菜单项上点击一次会执行两次后台请求（请求用户权限菜单）
  // 导致系统运行速度慢，本次更新制作了 isMenusExists 防止多次请求后台
  // 导致无法进入登录页面，然后添加下面代码解决无法进入登录页面的问题
  if(to.path === '/login'){
    next()
    return
  }

  // 重新构建路由并根据是否创建了新路由决定跳转页面的方式
  // 解决F5刷新无法跳转到动态路由上
  if(!isMenusExists){
    getUserMenus().then(res => {
      isMenusExists = true;

      const menus = parseMenus(res.data)
      const hasNewRoute = addRoutes(menus)
      hasNewRoute ? next(to.fullPath) : next()
    })
  }else{
    next()
  }
  
})

router.afterEach((to, from) => doneGlobalProgress())